import React, { Component } from 'react'
import {Input,Button,message,Spin} from 'antd';
import '../../../init.less'
import {saveHomeArticle} from '../../../api/request/home';
import Editor from 'for-editor'
 class index extends Component {
    constructor(){
        super()
        this.state = {
          loading:false,
            author:'',
            title:'',
            content:''
        }
    }
    hanleOnChangeInputTitle = (e)=>{
        this.setState({
            title:e.target.value,
           
        })
    } 
    hanleOnChangeInputAuthor = (e)=>{
        this.setState({
            author:e.target.value,
           
        })
    }
      handleChange=(content) =>{
        this.setState({
            content
        })
      }
      handleArticle = ()=>{
          console.log('object :', this.state);
          this.setState({
            loading:true
        })
          saveHomeArticle(this.state)
          .then(res=>{
            console.log('res :', res);
            message.success(res.msg)
            this.setState({
              loading:false
            })
          })
      }
      handleArticleClean=()=>{
          this.setState({
            author:'',
            title:'',
            content:''
          })
      }
    render() {
      const {author,title,content} = this.state
   
        return (
            <Spin spinning={this.state.loading}>
             <div className="dis-f"> <h4>标题</h4>  <Input className="input" placeholder="标题" value={title} onChange={this.hanleOnChangeInputTitle} /></div>
             <div className="dis-f"> <h4>作者名</h4>    <Input className="input" placeholder="作者名" value={author} onChange={this.hanleOnChangeInputAuthor} /></div>
             
              <Editor value={content} onChange={ this.handleChange} />
              <div className="btn">
              <Button type="primary"  onClick={this.handleArticleClean}>清空</Button> 
               <Button style={{marginLeft:10}}
               onClick={this.handleArticle}
               type="primary">提交</Button>
              </div>
            </Spin>
        )
    }
}
export default index